 <template>
 	<view class="change_password">
 		<view class="van-nav-bar van-nav-bar--fixed">
 			<view class="van-nav-bar__content">
 				<view class="van-nav-bar__left" @click="back">
 					<u-icon name="arrow-left" color="#fff" size="32rpx"></u-icon>
 				</view>
 				<view class="van-nav-bar__title van-ellipsis" style="margin-left: 66rpx;">{{common.userInfo.default[10]}}</view>
 				<view>
 				</view>
 			</view>
 		</view>

 		<view class="list">
 			<view class="items">
				<view class="items-top">
					<image src="../../static/image/my/suo.png" mode=""></image> 
					<text>{{common.userInfo.label[0]}}</text>
				</view>
 				
 				<input type="text" autocomplete="off" v-model="passForm.ol_password"
 					:placeholder="common.userInfo.placeholder[0]" >
 			</view>

 			<view class="items">
				<view class="items-top">
					<image src="../../static/image/my/yaos.png" mode=""></image> 
					<text>{{common.userInfo.label[1]}}</text>
				</view>
 				
 				<input type="text" autocomplete="off" v-model="passForm.password"
 					:placeholder="common.userInfo.placeholder[1]" >
 			</view>

 			<view class="items">
 				
				<view class="items-top">
					<image src="../../static/image/my/yaos.png" mode=""></image> 
					<text>{{common.userInfo.label[2]}}</text>
				</view>
 				<input type="text" autocomplete="off" v-model="passForm.password2"
 					:placeholder="common.userInfo.placeholder[2]" >
 			</view>
 		</view>

 		<view class="sumbbtn" @tap="btn">
 			{{common.userInfo.default[12]}}
 		</view>
 	</view>
 </template>

 <script>
 	export default {
 		data() {
 			return {
 				passForm: {
 					ol_password: '',
 					password: '',
 					password2: '',
 				}
 			};
 		},
 		computed: {
 			common() {
 				return this.$t("common")
 			},
 		},
 		methods: {
 			back() {
 				uni.navigateBack()
 			},

 			btn() {
 				const token = uni.getStorageSync('token')
 				this.$u.api.setting.change_pwd(token, this.passForm).then((res) => {
 					if (res.code == 1) {
 						this.$utils.showToast(this.common.userInfo.label[7])
 						setTimeout(() => {
 							uni.setStorageSync('token', '')
 							uni.redirectTo({
 								url: "/pages/common/login"
 							})
 						}, 1000)
 					}
 				})
 			}
 		}
 	}
 </script>

 <style lang="scss" scoped>
 	.change_password {
 		position: relative;
 		height: 100%;
 		padding-top: 70rpx;

 		.van-nav-bar {
 			background-color: #1A1A1A;
 		}
		.van-nav-bar__title{
			color: #fff;
		}

 		.list {
 			
 			
 			
			padding: 16rpx 24rpx;
			background-color: #222328;
			box-sizing: border-box;
 			.items {
				margin-top: 40rpx;
 				border-bottom: 1rpx solid #67686F;
				padding-bottom: 14rpx;
				.items-top{
					
					image{
						width: 34rpx;
						height: 34rpx;
					}
					text{
						margin-left: 12rpx;
						font-family: PingFang SC, PingFang SC;
						font-weight: bold;
						font-size: 30rpx;
						color: #FFFFFF;
					}
				}
				input{
					margin-top: 20rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 26rpx;
					
				}
 				

 				.van-field__control {
 					text-align: right;
 				}
 			}
 		}

 		.sumbbtn {
			margin-top: 80rpx;
			margin-left: 30rpx;
 			width: 690rpx;
 			height: 88rpx;
 			background: #03E4DF;
 			border-radius: 8rpx 8rpx 8rpx 8rpx;
			line-height: 88rpx;
			text-align: center;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			font-size: 32rpx;
			color: #111111;
 		}
 	}
 </style>